{include file="start" /}
<title>重卡汇</title>
<link rel="stylesheet" href="/_hongyanche/css/app.css">

<style>
.track-wrap{position: fixed; width: 100%;height: 100%;}
.track-wrap .header{padding:5px;text-align: center; font-size: 1.3rem; font-weight: 600; background: cadetblue;color: #fff;}
.track-wrap .weui-flex{display: flex;}
.track-wrap .track-list{margin-top: 0;}
.track-wrap .track-list .track-item{display: block; color: #333;}
.track-wrap .track-list .item-a{background: #eee; padding: 0;}
.track-wrap .item-a .item-num{width: 3rem;color: yellow;font-size: 18px;font-weight: 600;background: #ddd;height: 3rem;text-align: center;border-radius: 50%;line-height: 3rem;}
.track-wrap .item-a .item-time {font-size: 14px; padding-left: 1rem;}
.track-wrap .item-b .qi{background: url(/_hongyanche/material/qidian.png) no-repeat center;}
.track-wrap .item-b .zhong {background: url(/_hongyanche/material/zhongdian.png) no-repeat center;}
.track-wrap .item-b .icon {width: 2rem;height: 2rem;background-size: 70%;vertical-align: middle; display: block;}
.track-wrap .item-b .icon-text{vertical-align: middle;}
.track-wrap .item-c {font-size: 14px; margin-top: 0;}
</style>

<body>
    <div class="track-wrap">
        <div class="header">
            <span style="float:left" id="back"><</span>
            回放区间
        </div>
        <div class="track-list weui-cells">
            <a href="/home/car_track_detail" class="track-item weui-cells">
                <div class="item-a weui-cell weui-flex">
                    <span class="item-num">1</span>
                    <div class="item-time weui-flex__item">
                        <p>8月12日16：13：24 - 8月13日 23:08:23</p>
                        <p><strong>21小时6分钟</strong></p>
                    </div>
                </div>
                <div class="item-b">
                    <div class="qi-box weui-flex">
                        <span class="icon qi"></span>
                        <p class="icon-text  weui-flex__item">重庆市渝北区黄环北路</p>
                    </div>
                    <div class="zhong-box weui-flex">
                        <span class="icon zhong"></span>
                        <p class="icon-text weui-flex__item">北京市朝阳区</p>
                    </div>
                </div>
                <div class="item-c weui-cells">
                    <p class=" weui-cell">百公里油耗：<span class="num">28.4</span>/L，总油耗：<span class="num">406</span>/L</p>
                    <p class=" weui-cell">每小时行驶：<span class="num">68.0</span>km/h，总里程：<span>1436</span> km</p>
                </div>
            </a>
        </div>
    </div>
    <script>
        var backBtn = document.getElementById('back');
        backBtn.addEventListener('click', function() {
            window.history.back();
        });
    </script>
</body>